import React from "react"
import '../style/setStyle.css'
import { List } from "../api/index"
class Home extends React.Component {
    constructor() {
        super()
        this.state = {
            sum: []
        }
    }
    componentDidMount() {
        // const _this=this
        List().then(res => {
            //    console.log(res)
            this.setState({
                sum: res.data.result
            })
            console.log(this.state.sum)
        })

    }
    render() {

        return (
            <div >
                <div className="head">
                    <button><span>推荐音乐</span></button>
                    <button><span>热歌榜</span></button>
                    <button><span>搜索</span></button>
                </div>
                <div className="main" >
                    <h2>推荐歌单</h2>
                    {this.state.sum.map(({ name, picUrl,id }) =>
                        <div className="list" key={id}>
                            <img src={`${picUrl}`} alt="" />
                            <p>{name}</p>
                        </div>
                    )}
                </div>

            </div>

        )
    }
}

export default Home

